<template>
  <div class="app-container">
    <el-card>
      <el-page-header @back="goBack">
        <template #content>
          <div class="flex items-center">
            <div v-if="!route.query?.id">新增BOM清单</div>
            <div v-else-if="route.query?.copy">复制BOM清单</div>
            <div v-else-if="route.query?.info">BOM清单详情</div>
            <div v-else>编辑BOM清单</div>
          </div>
        </template>
        <template #extra>
          <div class="flex items-center" v-if="!route.query.info">
            <el-button type="primary" @click="submitForm">保 存</el-button>
          </div>
          <div class="flex items-center" v-if="route.query.info">
            <el-button type="primary" @click="handleCopy">复 制</el-button>
          </div>
        </template>
      </el-page-header>
    </el-card>
    <el-card style="margin-top: 10px">
      <el-collapse v-model="activeNames">
        <el-collapse-item disabled title="基本信息" name="1">
          <template #title>
            <el-icon style="color: #4479f6">
              <Position />
            </el-icon>
            <span class="title">基本信息</span>
          </template>
          <div>
            <el-form
              :model="form"
              :rules="rules"
              :disabled="flag"
              ref="userRef"
              label-width="110px"
            >
              <el-row :gutter="20">
                <el-col :span="6">
                  <el-form-item label="书刊编码" prop="bookCode">
                    <el-input
                      v-model="form.bookCode"
                      placeholder="请输入书刊编码"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="18">
                  <el-form-item label="书刊名称" prop="orderName">
                    <el-input
                      v-model="form.orderName"
                      placeholder="请输入书刊名称"
                    />
                  </el-form-item>
                </el-col>
                <!-- <el-col :span="6">
                                    <el-form-item label="印刷数量(册)" prop="printingCount">
                                        <el-input v-model="form.printingCount" type="number" placeholder="请输入印刷数量(册)"
                                            maxlength="18" />
                                    </el-form-item>
                                </el-col>
                                -->
              </el-row>
              <el-row :gutter="20">
                <el-col :span="6">
                  <el-form-item label="科目" prop="subjectType">
                    <el-select
                      style="width: 100%"
                      v-model="form.subjectType"
                      placeholder="请选择科目"
                      clearable
                    >
                      <el-option
                        v-for="item in ems_workshop_subject_type"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      />
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="书号" prop="bookNo">
                    <el-input
                      v-model="form.bookNo"
                      placeholder="请输入书号"
                      maxlength="30"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="定价" prop="fixPrice">
                    <el-input
                      type="number"
                      v-model="form.fixPrice"
                      placeholder="请输入定价"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="出版编码" prop="pubNo">
                    <el-input
                      v-model="form.pubNo"
                      @change="changePubNo"
                      placeholder="请输入出版编码"
                      maxlength="30"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="清样编号" prop="sampleNo">
                    <el-input
                      v-model="form.sampleNo"
                      placeholder="请输入清样编号"
                      maxlength="30"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="出版社" prop="publishingHouse">
                    <el-select
                      style="width: 100%"
                      v-model="form.publishingHouse"
                      placeholder="请选择出版社"
                      clearable
                    >
                      <el-option
                        v-for="item in production_publishing_house"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      />
                    </el-select>
                    <!-- <el-input
                                            v-model="form.publishingHouse"
                                            placeholder="请输入出版社"
                                            maxlength="30"
                                        /> -->
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="印次" prop="printNo">
                    <el-input v-model="form.printNo" placeholder="请输入印次" />
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="文件日期" prop="fileDate">
                    <el-date-picker
                      style="width: 100%"
                      v-model="form.fileDate"
                      value-format="YYYY-MM-DD"
                      type="date"
                      placeholder="请选择日期"
                    />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="20">
                <el-col :span="6">
                  <el-form-item label="适用范围" prop="applyRadius">
                    <el-input
                      v-model="form.applyRadius"
                      placeholder="请输入适用范围"
                      maxlength="30"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="打包方式" prop="packWay">
                    <el-select
                      style="width: 100%"
                      v-model="form.packWay"
                      clearable
                      placeholder="请选择打包方式"
                    >
                      <el-option
                        v-for="item in ems_order_pack_way"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      />
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="包内数量" prop="packInNum">
                    <el-input
                      v-model="form.packInNum"
                      clearable
                      type="number"
                      placeholder="请输入包内数量"
                    />
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="打包要求" prop="packageRequire">
                    <el-autocomplete
                      v-model="form.packageRequire"
                      :fetch-suggestions="querySearch"
                      clearable
                      style="width: 100%"
                      class="inline-input w-50"
                      placeholder="请选择或者输入"
                      @select="handleSelect"
                    />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="20">
                <el-col :span="24">
                  <el-form-item label="备注">
                    <el-input
                      v-model="form.remark"
                      type="textarea"
                      placeholder="请输入内容"
                    ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
        </el-collapse-item>
        <el-collapse-item
          disabled
          title="内文品种"
          name="2"
          v-if="tip == 0 || tip == 2"
        >
          <template #title>
            <el-icon style="color: #4479f6">
              <Position />
            </el-icon>
            <span class="title">内文品种</span>
          </template>
          <div class="order-form">
            <el-button
              size="small"
              type="primary"
              style="margin-bottom: 5px"
              v-if="!route.query.info"
              @click="handleAddorderBreed"
            >
              新增
            </el-button>
            <el-form :model="data" ref="orderBreedForm" class="data-form">
              <el-table
                class="tables"
                :data="data.orderBreed"
                row-key="pid"
                border
                :header-cell-class-name="must"
                @selection-change="handleSelectionChange"
              >
                <!-- <el-table-column type="selection" width="55" /> -->
                <el-table-column
                  label="序号"
                  width="60"
                  type="index"
                  align="center"
                />
                <!-- <el-table-column
                                    v-if="route.query?.id && !copy"
                                    label="订单品种编码"
                                    min-width="120"
                                    prop="breedNo"
                                    align="center"
                                >
                                </el-table-column> -->
                <el-table-column
                  label="品种"
                  width="180"
                  prop="breedType"
                  align="center"
                  v-if="!route.query.info"
                >
                  <template #default="scope">
                    <el-form-item
                      :prop="'orderBreed.' + scope.$index + '.breedType'"
                      :rules="[
                        {
                          required: true,
                          message: '品种',
                          trigger: 'change',
                        },
                      ]"
                    >
                      <el-autocomplete
                        v-model="scope.row.breedType"
                        :fetch-suggestions="querySearch"
                        @blur="changeMakeUp(scope.row, scope.$index)"
                        clearable
                        :disabled="flag"
                        style="width: 100%"
                        class="inline-input w-50"
                        placeholder="请选择或者输入"
                        @select="handleSelect"
                      />
                      <!-- <el-select
                                                :disabled="flag"
                                                style="width: 100%"
                                                v-model="scope.row.breedType"
                                                placeholder="请选择品种"
                                            >
                                                <el-option
                                                    v-for="item in ems_order_breed_type"
                                                    :key="item.value"
                                                    :label="item.label"
                                                    :value="item.value"
                                                />
                                            </el-select> -->
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="品种"
                  width="180"
                  prop="breedType"
                  align="center"
                  v-else
                ></el-table-column>

                <!-- <el-table-column label="印刷数量(册)" width="120" prop="printCount" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderBreed.' + scope.$index + '.printCount'"
                                            :rules="[{ required: true, message: '请输入', trigger: 'blur' }]">
                                            <el-input :disabled="flag" type="number" v-model="scope.row.printCount"
                                                placeholder="请输入印刷数量"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column> -->

                <!-- <el-table-column label="实用纸" width="120" prop="practicalPaper" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderBreed.' + scope.$index + '.practicalPaper'"
                                            :rules="[{ required: true, message: '实用纸', trigger: 'blur' }]">
                                            <el-select clearable :disabled="flag" style="width:100%"
                                                v-model="scope.row.practicalPaper" placeholder="请选择实用纸">
                                                <el-option v-for="item in ems_order_practical_paper" :key="item.value"
                                                    :label="item.label" :value="item.value" />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="令数" width="120" prop="lingCount" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderBreed.' + scope.$index + '.lingCount'"
                                            :rules="[{ required: true, message: '令数', trigger: 'blur' }]">
                                            <el-input :disabled="flag" type="number"
                                                @blur="changeSumPrice(scope.row, scope.$index)"
                                                v-model="scope.row.lingCount" placeholder="请输入令数"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="加工费(元/令)" width="120" prop="processPrice" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderBreed.' + scope.$index + '.processPrice'"
                                            :rules="[{ required: true, message: '加工费', trigger: 'blur' }]">
                                            <el-input :disabled="flag" @blur="changeSumPrice(scope.row, scope.$index)"
                                                type="number" v-model="scope.row.processPrice"
                                                placeholder="请输入加工费"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="金额(元)" width="120" prop="sumPrice" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderBreed.' + scope.$index + '.sumPrice'"
                                            :rules="[{ required: true, message: '金额', trigger: 'change' }]">
                                            <el-input :disabled="flag" type="number" v-model="scope.row.sumPrice"
                                                placeholder="自动计算"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column> -->
                <el-table-column
                  label="装订方式"
                  width="170"
                  prop="bindingMode"
                  align="center"
                  v-if="!route.query.info"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.bindingMode"
                        placeholder="请选择装订方式"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_order_binding_mode"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="装订方式"
                  min-width="120"
                  prop="bindingMode"
                  align="center"
                  v-else
                >
                  <template #default="scope">
                    <dict-tag
                      :options="ems_order_binding_mode"
                      :value="scope.row.bindingMode"
                    />
                  </template>
                </el-table-column>
                <el-table-column
                  label="开本数"
                  width="100"
                  prop="bookSize"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.bookSize"
                        placeholder="请选择开本数"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_produce_book_size"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="组成"
                  width="180"
                  prop="makeUp"
                  align="center"
                  v-if="!route.query.info"
                >
                  <template #default="scope">
                    <el-form-item
                      :prop="'orderBreed.' + scope.$index + '.makeUp'"
                      :rules="[
                        {
                          required: true,
                          message: '组成',
                          trigger: 'blur',
                        },
                      ]"
                    >
                      <el-select
                        clearable
                        @blur="changeMakeUp(scope.row, scope.$index)"
                        :disabled="flag"
                        style="width: 100%"
                        v-model="scope.row.makeUp"
                        placeholder="请选择组成"
                      >
                        <el-option
                          v-for="item in ems_order_make_up"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="组成"
                  width="180"
                  prop="makeUp"
                  align="center"
                  v-else
                ></el-table-column>
                <el-table-column
                  label="详细信息"
                  min-width="400"
                  prop="specifics"
                  v-if="!route.query.info"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-input
                        :disabled="flag"
                        v-model="scope.row.specifics"
                        type="textarea"
                        placeholder="请输入详细信息"
                      ></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="详细信息"
                  min-width="400"
                  prop="specifics"
                  v-else
                  align="center"
                />

                <el-table-column
                  label="贴数信息"
                  width="200"
                  prop="piece"
                  align="center"
                  v-if="!route.query.info"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-input
                        :disabled="flag"
                        v-model="scope.row.piece"
                        placeholder="请输入贴数信息"
                      ></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="贴数信息"
                  width="200"
                  prop="piece"
                  align="center"
                  v-else
                />

                <!-- <el-table-column
                                    label="印刷分类"
                                    width="120"
                                    prop="type"
                                    align="center"
                                >
                                    <template #default="scope">
                                        <el-form-item v-if="tip == 0">
                                            <el-select
                                                style="width: 100%"
                                                v-model="scope.row.printCategory"
                                                placeholder="请选择印刷分类"
                                                :disabled="flag"
                                            >
                                                <el-option
                                                    v-for="item in printCategoryList"
                                                    :key="item"
                                                    :label="item.label"
                                                    :value="item.value"
                                                    :disabled="item.diasbled"
                                                />
                                            </el-select>
                                        </el-form-item>
                                        <el-form-item v-if="tip == 1">
                                            <el-select
                                                style="width: 100%"
                                                v-model="scope.row.printCategory"
                                                placeholder="请选择印刷分类"
                                                :disabled="flag || scope.row.printCategory == 2"
                                            >
                                                <el-option
                                                    v-for="item in printCategoryList"
                                                    :key="item"
                                                    :label="item.label"
                                                    :value="item.value"
                                                    :disabled="item.diasbled"
                                                />
                                            </el-select>
                                        </el-form-item>
                                        <el-form-item v-if="tip == 2">
                                            <el-select
                                                style="width: 100%"
                                                v-model="scope.row.printCategory"
                                                placeholder="请选择印刷分类"
                                                :disabled="flag || scope.row.printCategory == 1"
                                            >
                                                <el-option
                                                    v-for="item in printCategoryList"
                                                    :key="item"
                                                    :label="item.label"
                                                    :value="item.value"
                                                    :disabled="item.diasbled"
                                                />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column> -->

                <el-table-column
                  label="印张"
                  prop="printSheet"
                  width="100"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-input
                        :disabled="flag"
                        type="number"
                        v-model="scope.row.printSheet"
                        placeholder="请输入印张"
                      ></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="印色"
                  width="100"
                  prop="printColor"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.printColor"
                        placeholder="请选择印色"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_order_print_color"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="颜色"
                  width="130"
                  prop="color"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.color"
                        placeholder="请选择颜色"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_produce_color"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="用纸尺寸"
                  prop="paperSize"
                  width="130"
                  align="center"
                  :disabled="flag"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-select
                        style="width: 100%"
                        clearable
                        v-model="scope.row.paperSize"
                        placeholder="请选择用纸尺寸"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_produce_paper_size"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <!--                                <el-table-column-->
                <!--                                    label="纸型"-->
                <!--                                    prop="paperSize"-->
                <!--                                    width="120"-->
                <!--                                    align="center"-->
                <!--                                >-->
                <!--                                    <template #default="scope">-->
                <!--                                        <el-form-item>-->
                <!--                                            <el-select-->
                <!--                                                style="width: 100%"-->
                <!--                                                v-model="scope.row.paperType"-->
                <!--                                                placeholder="请选择纸型"-->
                <!--                                                :disabled="flag"-->
                <!--                                            >-->
                <!--                                                <el-option-->
                <!--                                                    v-for="item in mes_paper_type"-->
                <!--                                                    :key="item.value"-->
                <!--                                                    :label="item.label"-->
                <!--                                                    :value="item.value"-->
                <!--                                                />-->
                <!--                                            </el-select>-->
                <!--                                        </el-form-item>-->
                <!--                                    </template>-->
                <!--                                </el-table-column>-->
                <!--                                <el-table-column-->
                <!--                                    label="定量"-->
                <!--                                    width="120"-->
                <!--                                    prop="weight"-->
                <!--                                    align="center"-->
                <!--                                >-->
                <!--                                    <template #default="scope">-->
                <!--                                        <el-form-item>-->
                <!--                                            <el-input-->
                <!--                                                :disabled="flag"-->
                <!--                                                type="number"-->
                <!--                                                v-model="scope.row.weight"-->
                <!--                                                placeholder="请输入定量"-->
                <!--                                            ></el-input>-->
                <!--                                        </el-form-item>-->
                <!--                                    </template>-->
                <!--                                </el-table-column>-->
                <el-table-column
                  label="成品尺寸(mm)"
                  min-width="120"
                  prop="finishSize"
                  align="center"
                  v-if="!route.query.info"
                >
                  <template #default="scope">
                    <el-form-item
                      :prop="'orderBreed.' + scope.$index + '.finishSize'"
                    >
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.finishSize"
                        placeholder="请输入成品尺寸"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_produce_finish_size"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="成品尺寸(mm)"
                  min-width="120"
                  prop="finishSize"
                  align="center"
                  v-else
                >
                  <template #default="scope">
                    <dict-tag
                      :options="ems_produce_finish_size"
                      :value="scope.row.finishSize"
                    />
                  </template>
                </el-table-column>

                <el-table-column
                  label="版材尺寸"
                  prop="sheetSize"
                  width="130"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.sheetSize"
                        placeholder="请选择版材尺寸"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_machine_info_size"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="出版编号"
                  width="120"
                  prop="pubNo"
                  align="center"
                  v-if="!route.query.info"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-input
                        :disabled="flag"
                        v-model="scope.row.pubNo"
                        placeholder="请输入出版编号"
                      ></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="出版编号"
                  width="120"
                  prop="pubNo"
                  align="center"
                  v-else
                />
                <!-- <el-table-column
                                    label="交货日期"
                                    width="120"
                                    prop="deliverDate"
                                    align="center"
                                >
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-date-picker
                                                @blur="changeDeliverDate(scope.row)"
                                                :disabled="flag"
                                                style="width: 100%"
                                                v-model="scope.row.deliverDate"
                                                value-format="YYYY-MM-DD"
                                                type="date"
                                                placeholder="请选择日期"
                                            />
                                        </el-form-item>
                                    </template>
                                </el-table-column> -->
                <!-- <el-table-column
                                    label="备注"
                                    width="120"
                                    prop="remark"
                                    align="center"
                                >
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-input
                                                :disabled="flag"
                                                v-model="scope.row.remark"
                                                placeholder="请输入备注"
                                            ></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column> -->
                <el-table-column
                  v-if="!flag"
                  label="操作"
                  align="center"
                  fixed="right"
                  class-name="small-padding fixed-width"
                >
                  <template #default="scope">
                    <el-tooltip content="删除" v-if="tip == 0" placement="top">
                      <el-button
                        link
                        type="primary"
                        icon="Delete"
                        @click="handleDelete(scope.row)"
                      ></el-button>
                    </el-tooltip>
                    <el-tooltip content="删除" v-if="tip == 1" placement="top">
                      <el-button
                        link
                        v-if="scope.row.printCategory == 1"
                        type="primary"
                        icon="Delete"
                        @click="handleDelete(scope.row)"
                      ></el-button>
                    </el-tooltip>
                    <el-tooltip content="删除" v-if="tip == 2" placement="top">
                      <el-button
                        link
                        v-if="scope.row.printCategory == 2"
                        type="primary"
                        icon="Delete"
                        @click="handleDelete(scope.row)"
                      ></el-button>
                    </el-tooltip>
                  </template>
                </el-table-column>
              </el-table>
            </el-form>
          </div>
        </el-collapse-item>
        <el-collapse-item
          disabled
          title="封面品种"
          name="2"
          v-if="tip == 0 || tip == 1"
        >
          <template #title>
            <el-icon style="color: #4479f6">
              <Position />
            </el-icon>
            <span class="title">封面品种</span>
          </template>
          <div class="order-form">
            <el-button
              size="small"
              type="primary"
              style="margin-bottom: 5px"
              v-if="!route.query.info"
              @click="handleAddorderBreedFM"
            >
              新增
            </el-button>
            <el-form :model="data" ref="orderCoverForm" class="data-form">
              <el-table
                :data="data.orderCover"
                border
                :header-cell-class-name="mustFM"
                @selection-change="handleSelectionChange"
              >
                <!-- <el-table-column type="selection" width="55" /> -->
                <el-table-column
                  label="序号"
                  width="60"
                  type="index"
                  align="center"
                />
                <!-- <el-table-column
                                    v-if="route.query?.id && !copy"
                                    label="订单品种编码"
                                    min-width="120"
                                    prop="breedNo"
                                    align="center"
                                >
                                </el-table-column> -->
                <el-table-column
                  label="品种"
                  min-width="150"
                  prop="breedType"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item
                      :prop="'orderCover.' + scope.$index + '.breedType'"
                      :rules="[
                        {
                          required: true,
                          message: '品种',
                          trigger: 'change',
                        },
                      ]"
                    >
                      <!-- <el-select
                                                :disabled="flag"
                                                style="width: 100%"
                                                v-model="scope.row.breedType"
                                                placeholder="请选择品种"
                                            >
                                                <el-option
                                                    v-for="item in breedTypeListFM"
                                                    :key="item.value"
                                                    :label="item.label"
                                                    :value="item.value"
                                                />
                                            </el-select> -->
                      <el-autocomplete
                        v-model="scope.row.breedType"
                        :fetch-suggestions="querySearchFM"
                        clearable
                        :disabled="flag"
                        style="width: 100%"
                        class="inline-input w-50"
                        placeholder="请选择或者输入"
                        @select="handleSelectFM"
                      />
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="组成"
                  min-width="150"
                  prop="makeUp"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item
                      :prop="'orderCover.' + scope.$index + '.makeUp'"
                      :rules="[
                        {
                          required: true,
                          message: '组成',
                          trigger: 'blur',
                        },
                      ]"
                    >
                      <el-select
                        :disabled="flag"
                        style="width: 100%"
                        v-model="scope.row.makeUp"
                        placeholder="请选择组成"
                      >
                        <el-option
                          v-for="item in ems_order_make_up_fm"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column
                  label="印色"
                  min-width="120"
                  prop="printColor"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item
                      :prop="'orderCover.' + scope.$index + '.printColor'"
                      :rules="[
                        {
                          required: true,
                          message: '印色',
                          trigger: 'blur',
                        },
                      ]"
                    >
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.printColor"
                        placeholder="请选择印色"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_order_print_color"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="颜色"
                  min-width="120"
                  prop="color"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item
                      :prop="'orderCover.' + scope.$index + '.printColor'"
                      :rules="[
                        {
                          required: true,
                          message: '颜色',
                          trigger: 'blur',
                        },
                      ]"
                    >
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.color"
                        placeholder="请选择颜色"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_produce_color"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="覆膜"
                  width="120"
                  prop="coverFilm"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-select
                        clearable
                        style="width: 100%"
                        v-model="scope.row.coverFilm"
                        placeholder="请选择覆膜"
                        :disabled="flag"
                      >
                        <el-option
                          v-for="item in ems_produce_cover_film"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="备注"
                  min-width="120"
                  prop="remark"
                  align="center"
                >
                  <template #default="scope">
                    <el-form-item>
                      <el-input
                        :disabled="flag"
                        v-model="scope.row.remark"
                        placeholder="请输入备注"
                      ></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  v-if="!flag"
                  label="操作"
                  align="center"
                  fixed="right"
                  class-name="small-padding fixed-width"
                >
                  <template #default="scope">
                    <el-tooltip content="删除" placement="top">
                      <el-button
                        link
                        type="primary"
                        icon="Delete"
                        @click="handleDeleteFM(scope.row)"
                      ></el-button>
                    </el-tooltip>
                    <!-- <el-tooltip content="删除" v-if="tip == 1" placement="top">
                                            <el-button
                                                link
                                                v-if="scope.row.printCategory == 1"
                                                type="primary"
                                                icon="Delete"
                                                @click="handleDeleteFM(scope.row)"
                                            ></el-button>
                                        </el-tooltip>
                                        <el-tooltip content="删除" v-if="tip == 2" placement="top">
                                            <el-button
                                                link
                                                v-if="scope.row.printCategory == 2"
                                                type="primary"
                                                icon="Delete"
                                                @click="handleDeleteFM(scope.row)"
                                            ></el-button>
                                        </el-tooltip> -->
                  </template>
                </el-table-column>
              </el-table>
            </el-form>
          </div>
        </el-collapse-item>
        <!-- <el-collapse-item disabled  title="产品明细" name="3">
                    <template #title>
                        <el-icon style="color: #4479F6;">
                            <Position />
                        </el-icon> <span class="title">产品明细</span>
                    </template>
                    <div class="order-form">
                        <el-form :model="data" ref="orderProductForm" :disabled="flag" class="data-form">
                            <el-table :data="data.orderProduct" ref="orderProductRef" border
                                :header-cell-class-name="mustProduct" :row-class-name="tableRowClassName">
                                <el-table-column label="序号" width="60" type="index" align="center" />
                                <el-table-column v-if="route.query?.id && !copy" label="订单品种编码" min-width="120"
                                    prop="breedNo" align="center">
                                </el-table-column>
                                <el-table-column label="品种" prop="breedType" min-width="160" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderProduct.' + scope.$index + '.breedType'"
                                            :rules="[{ required: true, message: '品种', trigger: 'blur' }]">
                                            <el-select style="width:100%" v-model="scope.row.breedType" disabled
                                                placeholder="请选择品种">
                                                <el-option v-for="item in ems_order_breed_type" :key="item.value"
                                                    :label="item.label" :value="item.value" />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="组成" min-width="160" prop="makeUp" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderProduct.' + scope.$index + '.makeUp'"
                                            :rules="[{ required: true, message: '组成', trigger: 'blur' }]">
                                            <el-select style="width:100%" disabled v-model="scope.row.makeUp"
                                                placeholder="请选择组成">
                                                <el-option v-for="item in ems_order_make_up" :key="item.value"
                                                    :label="item.label" :value="item.value" />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="印色" width="120" prop="printColor" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderProduct.' + scope.$index + '.printColor'"
                                            :rules="[{ required: true, message: '印色', trigger: 'blur' }]">
                                            <el-select clearable style="width:100%" v-model="scope.row.printColor"
                                                placeholder="请选择印色">
                                                <el-option v-for="item in ems_order_print_color" :key="item.value"
                                                    :label="item.label" :value="item.value" />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="规格" prop="spec" width="120" align="center">
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-select clearable style="width:100%" v-model="scope.row.spec"
                                                placeholder="请选择规格">
                                                <el-option v-for="item in ems_order_spec" :key="item.value"
                                                    :label="item.label" :value="item.value" />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="印张" width="120" prop="printSheet" align="center">
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-input v-model="scope.row.printSheet" placeholder="请输入印张"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                
                                <el-table-column label="成品尺寸(mm)" width="120" prop="dimension" align="center">
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-input v-model="scope.row.dimension" placeholder="请输入成品尺寸"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="交货日期" min-width="120" prop="deliverDate" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderProduct.' + scope.$index + '.deliverDate'"
                                            :rules="[{ required: true, message: '交货日期', trigger: 'blur' }]">
                                            <el-date-picker style="width: 100%; " v-model="scope.row.deliverDate"
                                                value-format="YYYY-MM-DD" type="date" placeholder="请选择日期" />
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="备注" width="120" prop="remark" align="center">
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-input v-model="scope.row.remark" placeholder="请输入备注"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </el-form>
                    </div>
                </el-collapse-item> -->
        <!-- <el-collapse-item disabled  title="内文明细" name="4">
                    <template #title>
                        <el-icon style="color: #4479F6;">
                            <Position />
                        </el-icon> <span class="title">内文明细</span>
                    </template>
                    <div class="order-form">
                        <el-form :model="data" ref="orderNeiwenForm" :disabled="flag" class="data-form">
                            <el-table :data="data.orderNeiwen" ref="orderNeiwenRef" border
                                :header-cell-class-name="mustOrderNeiwen" :row-class-name="tableRowClassName">
                                <el-table-column label="序号" width="60" type="index" align="center" />
                                <el-table-column v-if="route.query?.id && !copy" label="订单品种编码" min-width="120"
                                    prop="breedNo" align="center">
                                </el-table-column>
                                <el-table-column label="品种" prop="breedType" min-width="160" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderNeiwen.' + scope.$index + '.breedType'"
                                            :rules="[{ required: true, message: '品种', trigger: 'blur' }]">
                                            <el-select style="width:100%" v-model="scope.row.breedType" disabled
                                                placeholder="请选择品种">
                                                <el-option v-for="item in ems_order_breed_type" :key="item.value"
                                                    :label="item.label" :value="item.value" />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="组成" min-width="160" prop="makeUp" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderNeiwen.' + scope.$index + '.makeUp'"
                                            :rules="[{ required: true, message: '组成', trigger: 'blur' }]">
                                            <el-select style="width:100%" disabled v-model="scope.row.makeUp"
                                                placeholder="请选择组成">
                                                <el-option v-for="item in ems_order_make_up" :key="item.value"
                                                    :label="item.label" :value="item.value" />
                                            </el-select>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="目录(起)" width="120" prop="catalogueBegin" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderNeiwen.' + scope.$index + '.catalogueBegin'"
                                            :rules="[{ required: true, message: '目录(起)', trigger: 'blur' }]">
                                            <el-input type="number" @blur="changePageSum(scope.row, scope.$index)"
                                                v-model="scope.row.catalogueBegin" placeholder="请输入目录(起)"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="背/目录(止)" width="120" prop="catalogueEnd" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderNeiwen.' + scope.$index + '.catalogueEnd'"
                                            :rules="[{ required: true, message: '背/目录(止)', trigger: 'blur' }]">
                                            <el-input type="number" @blur="changePageSum(scope.row, scope.$index)"
                                                v-model="scope.row.catalogueEnd" placeholder="请输入目录(起)"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="正文(起)" width="120" prop="textBegin" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderNeiwen.' + scope.$index + '.textBegin'"
                                            :rules="[{ required: true, message: '正文(起)', trigger: 'blur' }]">
                                            <el-input type="number" @blur="changePageSum(scope.row, scope.$index)"
                                                v-model="scope.row.textBegin" placeholder="请输入正文(起)"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="正文(止)" width="120" prop="textEnd" align="center">
                                    <template #default="scope">
                                        <el-form-item :prop="'orderNeiwen.' + scope.$index + '.textEnd'"
                                            :rules="[{ required: true, message: '正文(止)', trigger: 'blur' }]">
                                            <el-input type="number" @blur="changePageSum(scope.row, scope.$index)"
                                                v-model="scope.row.textEnd" placeholder="请输入正文(止)"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="共(码)" width="120" prop="pageSum" align="center">
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-input type="number" disabled v-model="scope.row.pageSum"
                                                placeholder="自动计算"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>

                                <el-table-column label="印张" width="120" prop="printSheet" align="center">
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-input type="number" disabled v-model="scope.row.printSheet"
                                                placeholder="自动计算"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                                <el-table-column label="备注" width="120" prop="remark" align="center">
                                    <template #default="scope">
                                        <el-form-item>
                                            <el-input v-model="scope.row.remark" placeholder="请输入备注"></el-input>
                                        </el-form-item>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </el-form>
                    </div>
                </el-collapse-item> -->
      </el-collapse>
    </el-card>
  </div>
</template>

<script setup>
import { toNumber } from "@/utils/ruoyi";
import Sortable from "sortablejs";
import useTagsViewStore from "@/store/modules/tagsView";
import auth from "@/plugins/auth";
const tagsViewStore = useTagsViewStore();
import {
  addMesOrderInfo,
  editMesOrderInfo,
  getMesOrderDetail,
  getMesOrderInfo,
  getBookNo,
} from "@/api/production/order";
import { ElMessage } from "element-plus";
const { proxy } = getCurrentInstance();
import useUserStore from "@/store/modules/user";
import { nextTick } from "vue";
const {
  ems_order_pack_way,
  ems_workshop_subject_type,
  ems_order_make_up,
  ems_order_breed_type,
  ems_order_binding_mode,
  ems_order_spec,
  ems_order_print_color,
  ems_order_practical_paper,
  ems_produce_book_size,
  ems_produce_finish_size,
  mes_paper_type,
  ems_machine_info_size,
  ems_produce_color,
  ems_produce_paper_size,
  ems_order_make_up_fm,
  ems_produce_cover_film,
  production_publishing_house,
} = proxy.useDict(
  "ems_order_practical_paper",
  "ems_order_print_color",
  "ems_order_binding_mode",
  "ems_order_spec",
  "ems_order_pack_way",
  "ems_order_make_up",
  "ems_workshop_subject_type",
  "ems_order_breed_type",
  "ems_produce_book_size",
  "ems_produce_finish_size",
  "mes_paper_type",
  "ems_machine_info_size",
  "ems_produce_color",
  "ems_produce_paper_size",
  "ems_order_make_up_fm",
  "ems_produce_cover_film",
  "production_publishing_house"
);

const route = useRoute();
const router = useRouter();
const activeNames = ["1", "2", "3", "4"];
const breedTypeListNW = ref([]);
const breedTypeListFM = ref([]);
const userRef = ref(null);
const orderBreedForm = ref(null);
const orderCoverForm = ref(null);
const flag = ref(false);
const copy = ref(false);
const chnageState = ref([]);
const breedPidList = ref([]);
const orderBreedFM = ref([]);
const orderBreedNW = ref([]);
const respData = ref({});
const data = reactive({
  orderBreed: [], // 内文
  orderCover: [], // 封面
  // orderProduct: [], // 明细
  // orderNeiwen: [], // 内文
  form: {},
  rules: {
    // bookCode: [{ required: true, message: '书刊编码不能为空', trigger: 'blur' }],
    orderName: [
      { required: true, message: "书刊名称不能为空", trigger: "blur" },
    ],
    // printingCount: [{ required: true, message: '印刷数量(册)不能为空', trigger: 'blur' }],
    // fileDate: [{ required: true, message: '文件日期不能为空', trigger: 'blur' }],
    // packWay: [{ required: true, message: '打包方式不能为空', trigger: ['blur'] }],
    // subjectType: [{ required: true, message: '科目不能为空', trigger: ['blur'] }],
    // publishingHouse: [{ required: true, message: '出版社不能为空', trigger: 'blur' }],
  },
});
const { form, rules, orderBreed, orderProduct, orderNeiwen, orderCover } =
  toRefs(data);
function moveArrayElement(array, oldIndex, newIndex) {
  if (
    oldIndex >= 0 &&
    oldIndex < array.length &&
    newIndex >= 0 &&
    newIndex < array.length
  ) {
    const [element] = array.splice(oldIndex, 1);
    array.splice(newIndex, 0, element);
  } else {
    console.log("索引超出范围");
  }
  return array;
}
onMounted(() => {
  // 获取el-table DOM
  const el = document.querySelector(
    ".tables .el-table__body-wrapper  table tbody"
  );
  Sortable.create(el, {
    animation: 150,
    ghostClass: "blue-background-class",
    onEnd: function (/**Event*/ evt) {
      let newIndex = evt.newIndex; // 排序后的索引位置
      let oldIndex = evt.oldIndex; // 排序前的索引位置
      var itemEl = evt.item; // 拖拽 HTMLElement
      moveArrayElement(orderBreed.value, oldIndex, newIndex);
      // const temp = orderBreed.value[oldIndex];
      // orderBreed.value[oldIndex] = orderBreed.value[newIndex];
      // orderBreed.value[newIndex] = temp;
      // orderBreed.value[newIndex].$index = oldIndex
      // orderBreed.value[oldIndex].$index = newIndex
      evt.to; // 目标表
      evt.from; // 上一个列表
      evt.oldIndex; // 元素在旧父级中的旧索引
      evt.newIndex; // 元素在新父级中的新索引
      evt.clone; // 克隆元件
      evt.pullMode; // 当项目在另一个可排序表中时：`“clone”`如果克隆，`true`如果移动
    },
    //点击选中元素事件
    onChoose: function (/**Event*/ evt) {
      evt.oldIndex;
    },
    //取消选中事件
    onUnchoose: function (/**Event*/ evt) {},
  });
});
const printCategoryList = ref([
  {
    label: "封面",
    value: "1",
  },
  {
    label: "内文",
    value: "2",
  },
]);
const tip = ref(0);
const changePubNo = (row) => {
  orderBreed.value.forEach((item) => {
    item.pubNo = row;
  });
};
const getCreatedBookNo = () => {
  getBookNo().then((res) => {
    form.value.pubNo = res.data;
  });
};
// 权限
const permissions = useUserStore().roles;

if (permissions.includes("orderFM") && !permissions.includes("orderNW")) {
  // 封面
  printCategoryList.value = [
    {
      label: "封面",
      value: "1",
    },
    {
      label: "内文",
      value: "2",
      diasbled: true,
    },
  ];

  tip.value = 1;
} else if (
  permissions.includes("orderNW") &&
  !permissions.includes("orderFM")
) {
  // 内文
  printCategoryList.value = [
    {
      label: "封面",
      value: "1",
      diasbled: true,
    },
    {
      label: "内文",
      value: "2",
    },
  ];
  tip.value = 2;
} else {
  printCategoryList.value = [
    {
      label: "封面",
      value: "1",
    },
    {
      label: "内文",
      value: "2",
    },
  ];
  tip.value = 0;
}
if (route.query?.id) {
  getMesOrderDetail({ pid: route.query.id }).then((res) => {
    respData.value = { ...res.data };
    Object.assign(form.value, { ...res.data });
    // orderNoVal.value = res.data.orderNo
    if (res.data.orderBreed) {
      // res.data.orderBreed.forEach(item => {
      //     // item.breedType = item.breedType?.toString()
      //     // item.practicalPaper = item.practicalPaper?.toString()
      //     if (route.query.copy) {
      //         item.breedNo = null
      //     }
      // })
    } else {
      res.data.orderBreed = [];
    }
    orderBreed.value = res.data.orderBreed;
    orderCover.value = res.data.orderCover;
    handleBreedTypeFM(orderCover.value);
    handleBreedTypeNW(orderBreed.value);
    form.value.packWay = res.data.packWay?.toString();
    if (route.query.info) {
      flag.value = true;
    }
    if (route.query.copy) {
      getBookNo().then((res) => {
        form.value.pubNo = res.data;
        orderBreed.value.forEach((item) => {
          item.pubNo = res.data;
        });
      });
      copy.value = true;
      // form.value.orderNo = ''
    }
  });
} else if (route.query?.copyAdd) {
  const resp = JSON.parse(route.query.copyAdd);
  form.value = { ...resp };
  form.value.pid = undefined;
  form.value.bookCode = undefined;
  form.value.orderName = undefined;
  // getCreatedBookNo();
  getBookNo().then((res) => {
    form.value.pubNo = res.data;
    orderBreed.value.forEach((item) => {
      item.pubNo = res.data;
    });
  });
  orderBreed.value = resp.orderBreed;
  orderCover.value = resp.orderCover;
} else {
  form.value = {};
  orderBreed.value = [];
  flag.value = false;
  copy.value = false;
  getCreatedBookNo();
}

const querySearch = (queryString, cb) => {
  const results = queryString
    ? breedTypeListNW.value.filter(createFilter(queryString))
    : breedTypeListNW.value;
  cb(results);
};
const createFilter = (queryString) => {
  return (restaurant) => {
    return (
      restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
    );
  };
};
const handleSelect = (item) => {
  console.log(item);
};

const querySearchFM = (queryString, cb) => {
  const results = queryString
    ? breedTypeListFM.value.filter(createFilter(queryString))
    : breedTypeListFM.value;
  cb(results);
};
const handleSelectFM = (item) => {
  console.log(item);
};
// 内文生成封面
const changeMakeUp = (row, index) => {
  orderCover.value = orderCover.value.filter(
    (item) => item.breedId !== row.pid
  );
  // if (row.breedType == '书') {
  if (row.makeUp?.includes("封面+彩页")) {
    orderCover.value.push(
      {
        breedId: row.pid,
        breedType: row.breedType,
        pid: generateUniqueId(),
        type: 1,
        makeUp: "封面",
      },
      {
        breedId: row.pid,
        breedType: row.breedType,
        pid: generateUniqueId(),
        type: 1,
        makeUp: "彩页",
      }
    );
  } else if (row.makeUp?.includes("封面")) {
    orderCover.value.push({
      breedId: row.pid,
      breedType: row.breedType,
      pid: generateUniqueId(),
      type: 1,
      makeUp: "封面",
    });
  }
  // if (row.makeUp.includes('封面') && !row.makeUp.includes('封面+彩页')) {
  // }
  // }
};
// watch(() => route.query?.id, (newValue, oldValue) => {
//     if (newValue) {

//     }
//     else {

//     }
// }, { immediate: true });
//  返回
const goBack = () => {
  router.push("/Productionmanagementdistribution/production/order");
  tagsViewStore.delView(route);
  // setTimeout(() => {
  //     tagsViewStore.delView(route);
  // }, 0);
  // router.go(-1)
};
// 品种金额计算
const changeSumPrice = (row, index) => {
  if (row.lingCount && row.processPrice) {
    let sum = Number(row.lingCount) * Number(row.processPrice);
    orderBreed.value[index].sumPrice = toNumber(sum, 2);
  }
};
// 共（码）计算
const changePageSum = (row, index) => {
  if (row.textEnd && row.textBegin && row.catalogueEnd) {
    let count =
      Number(row.textEnd) -
      Number(row.textBegin) +
      1 +
      Number(row.catalogueEnd);
    let printSheet = count / 16;
    orderNeiwen.value[index].pageSum = toNumber(count, 0);
    orderNeiwen.value[index].printSheet = toNumber(printSheet, 1);
  }
};

const must = (obj) => {
  let mustColumns = [1, 2];
  if (mustColumns.includes(obj.columnIndex)) {
    return "must";
  }
};
const mustFM = (obj) => {
  let mustColumns = [1, 2, 3, 4];
  // if (route.query?.id) {
  //     if (route.query.copy) {
  //         mustColumns = [1, 2, 3, 4]
  //     } else {
  //         mustColumns = [2, 3, 4, 5]
  //     }
  // } else {
  //     mustColumns = [1, 2, 3, 4]
  // }
  if (mustColumns.includes(obj.columnIndex)) {
    return "must";
  }
};
const mustProduct = (obj) => {
  let mustColumns = [];
  if (route.query?.id) {
    if (route.query.copy) {
      mustColumns = [1, 2, 3, 8];
    } else {
      mustColumns = [2, 3, 4, 9];
    }
  } else {
    mustColumns = [1, 2, 3, 8];
  }
  if (mustColumns.includes(obj.columnIndex)) {
    return "must";
  }
};
const mustOrderNeiwen = (obj) => {
  let mustColumns = [];
  if (route.query?.id) {
    if (route.query.copy) {
      mustColumns = [1, 2, 3, 4, 5, 6];
    } else {
      mustColumns = [2, 3, 4, 5, 6, 7];
    }
  } else {
    mustColumns = [1, 2, 3, 4, 5, 6];
  }
  if (mustColumns.includes(obj.columnIndex)) {
    return "must";
  }
};
const generateUniqueId = () => {
  const timestamp = Date.now().toString();
  const randomNum = Math.floor(Math.random() * 1000).toString();
  return Number(timestamp + randomNum);
};
const handleBreedTypeNW = (orderList) => {
  let list = orderList.map((item) => item.breedType);
  list = Array.from(new Set(list.filter((item) => item !== undefined)));
  const arr = list.map((ele) => {
    return {
      label: ele,
      value: ele,
    };
  });
  if (list?.length > 0) {
    breedTypeListFM.value = [
      ...new Map(
        [...ems_order_breed_type.value, ...arr].map((v) => [v.value, v])
      ).values(),
    ];
  } else {
    breedTypeListFM.value = ems_order_breed_type.value;
  }
};
const handleBreedTypeFM = (orderList) => {
  let list = orderList.map((item) => item.breedType);
  list = Array.from(new Set(list.filter((item) => item !== undefined)));
  const arr = list.map((ele) => {
    return {
      label: ele,
      value: ele,
    };
  });
  if (list?.length > 0) {
    breedTypeListNW.value = [
      ...new Map(
        [...ems_order_breed_type.value, ...arr].map((v) => [v.value, v])
      ).values(),
    ];
  } else {
    breedTypeListNW.value = ems_order_breed_type.value;
  }
};
//  新增产品品种 内文
const handleAddorderBreed = () => {
  let list = orderCover.value.map((item) => item.breedType);
  list = Array.from(new Set(list.filter((item) => item !== undefined)));
  const arr = list.map((ele) => {
    return {
      label: ele,
      value: ele,
    };
  });
  if (list?.length > 0) {
    breedTypeListNW.value = [
      ...new Map(
        [...ems_order_breed_type.value, ...arr].map((v) => [v.value, v])
      ).values(),
    ];
  } else {
    breedTypeListNW.value = ems_order_breed_type.value;
  }
  orderBreed.value.push({
    pid: generateUniqueId(),
    type: 1,
    printCategory: 2,
    pubNo: form.value.pubNo,
    printCount: form.value.printingCount,
  });
};
//  新增产品品种 封面
const handleAddorderBreedFM = () => {
  let list = orderBreed.value.map((item) => item.breedType);
  list = Array.from(new Set(list.filter((item) => item !== undefined)));
  const arr = list.map((ele) => {
    return {
      label: ele,
      value: ele,
    };
  });
  if (list?.length > 0) {
    breedTypeListFM.value = [
      ...new Map(
        [...ems_order_breed_type.value, ...arr].map((v) => [v.value, v])
      ).values(),
    ];
  } else {
    breedTypeListFM.value = ems_order_breed_type.value;
  }
  orderCover.value.push({
    pid: generateUniqueId(),
    type: 1,
    printCategory: 1,
    // pubNo: form.value.pubNo,
  });
};

// 组成分解
const changeOrderProduct = (row) => {
  if (orderProduct.value.length > 0) {
    orderProduct.value = orderProduct.value.filter(
      (item) => item.breedPid !== row.pid
    );
  }
  if (orderNeiwen.value.length > 0) {
    orderNeiwen.value = orderNeiwen.value.filter(
      (item) => item.breedPid !== row.pid
    );
  }
  if (row.makeUp?.length > 0 && row.breedType) {
    row.makeUp.forEach((element) => {
      orderProduct.value.push({
        type: 1,
        deliverDate: row.deliverDate,
        pid: generateUniqueId(),
        breedPid: row.pid,
        makeUp: element.toString(),
        breedType: row.breedType,
      });
      if (element == 3) {
        orderNeiwen.value.push({
          type: 1,
          catalogueBegin: 1,
          breedPid: row.pid,
          makeUp: element.toString(),
          breedType: row.breedType,
        });
      }
    });
  }
};
// 产品尺寸自动带出
const changeDimension = (row) => {
  if (orderProduct.value.length > 0) {
    orderProduct.value.forEach((item) => {
      if (row.pid === item.breedPid) {
        item.dimension = row.dimension;
      }
    });
  }
};
// 交货日期自动带出
const changeDeliverDate = (row) => {
  console.log(row);
  if (orderProduct.value.length > 0) {
    orderProduct.value.forEach((item) => {
      console.log(item);
      if (row.pid === item.breedPid) {
        item.deliverDate = row.deliverDate;
      }
    });
  }
};
// 被选中
const handleSelectionChange = (row) => {
  chnageState.value = row;
};

const tableRowClassName = ({ row, rowIndex }) => {
  if (chnageState.value.some((item) => item.pid === row.breedPid)) {
    return "success-row";
  } else {
    return "";
  }
};

const handleDelete = (row) => {
  proxy.$modal.confirm("是否确认删除该明细？").then(function () {
    // if (route.query?.id && row.type == 2) {
    //     breedPidList.value.push(row.pid)
    // }
    orderBreed.value = orderBreed.value.filter((item) => item.pid !== row.pid);
    orderCover.value = orderCover.value.filter(
      (item) => item.breedId !== row.pid
    );
    proxy.$modal.msgSuccess("删除成功");
  });
};
const handleDeleteFM = (row) => {
  proxy.$modal.confirm("是否确认删除该明细？").then(function () {
    // if (route.query?.id && row.type == 2) {
    //     breedPidList.value.push(row.pid)
    // }
    orderCover.value = orderCover.value.filter((item) => item.pid !== row.pid);
    proxy.$modal.msgSuccess("删除成功");
  });
};
// 确认

const listToObj = (val) => {
  console.log(val);
  let newArr = [];
  if (val.length > 0) {
    newArr = val.map((item) => {
      return {
        ...item,
        makeUp: item.makeUp?.join(","),
      };
    });
  }
  return newArr;
};

// 清除主键
const clearId = (list, key) => {
  if (list.length > 0) {
    list.forEach((item) => {
      delete item[key];
    });
  }
};
//除主
const handleCopy = () => {
  const obj = tagsViewStore.visitedViews[2];
  console.log(obj);
  obj.path = "/production/order/orderDetails";
  obj.title = "新增BOM清单";
  obj.query = {};
  (obj.query.copyAdd = JSON.stringify(respData.value)),
    nextTick(() => {
      proxy.$tab.refreshPage(obj);
    });
};

const submitForm = async () => {
  try {
    await userRef.value.validate();
    if (tip.value == 0 || tip.value == 1) {
      await orderCoverForm.value.validate();
    }
    if (tip.value == 0 || tip.value == 2) {
      await orderBreedForm.value.validate();
    }
    // orderBreed.value.forEach(item => {
    //     item.pid = generateUniqueId()
    // })

    orderBreed.value.forEach((item, ind) => {
      item.sort = ind;
    });
    if (orderCover.value.length > 0) {
    }
    orderCover.value.forEach((item, ind) => {
      item.sort = ind;
    });
    // const subjectType = form.value.subjectType.join(',')
    if (route.query?.id) {
      if (copy.value) {
        // 复制
        form.value.status = 1;
        form.value.pid = undefined;
        orderBreed.value.forEach((item) => {
          orderCover.value.forEach((ele) => {
            if (item.pid == ele.breedId) {
              item.breedId = ele.breedId;
            }
          });
        });
        orderBreed.value.forEach((item) => {
          item.pid = generateUniqueId();
          orderCover.value.forEach((ele) => {
            if (item.breedId == ele.breedId) {
              ele.breedId = item.pid;
            }
          });
        });
        clearId(orderCover.value, "pid");
        await addMesOrderInfo({
          ...form.value,
          orderBreed: orderBreed.value,
          orderCover: orderCover.value,
        });
        ElMessage({
          message: "复制成功",
          type: "success",
        });
      } else {
        await editMesOrderInfo({
          ...form.value,
          orderBreed: orderBreed.value,
          orderCover: orderCover.value,
        });
        ElMessage({
          message: "编辑成功",
          type: "success",
        });
      }
      goBack();
    } else {
      if (route.query?.copyAdd) {
        orderBreed.value.forEach((item) => {
          orderCover.value.forEach((ele) => {
            if (item.pid == ele.breedId) {
              item.breedId = ele.breedId;
            }
          });
        });
        orderBreed.value.forEach((item) => {
          item.pid = generateUniqueId();
          orderCover.value.forEach((ele) => {
            if (item.breedId == ele.breedId) {
              ele.breedId = item.pid;
            }
          });
        });
        clearId(orderCover.value, "pid");
      }
      // 新增
      form.value.status = 1;
      await addMesOrderInfo({
        ...form.value,
        orderBreed: orderBreed.value,
        orderCover: orderCover.value,
      });
      ElMessage({
        message: "新增成功",
        type: "success",
      });
      goBack();
    }
  } catch (error) {
    if (Object.keys(error)?.join(",").includes(".")) {
      const errInfoList = Object.values(error);
      console.log(errInfoList);
      const err = [];
      errInfoList.forEach((item) => {
        err.push(item[0].message);
      });
      ElMessage({
        message: `请将${err.join("、")}信息补充完整`,
        type: "warning",
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.footer {
  text-align: center;
}

:deep(.el-pagination) {
  position: unset;
}

.order-form :deep(.el-form-item) {
  margin-bottom: 0px;
}

:deep(.el-table th.must div:before) {
  content: "*";
  color: #ff1818;
}

:deep(.el-table) .success-row {
  background: #dae5f4 !important;
}
</style>
